@import '../../common';

.header{
    width:100%;
    height:1.867rem;
    background:#15AE67;
}
.logo{
    height:1.1466666667rem;
    margin-top:-0.5733334rem;
    float:left;
    position:relative;
    top:50%;
    left:20px;
}
.logo-text{
    float:left;
    line-height: 1.867rem;
    margin-left:35px;
    color:#fff;
    font-size:14px;
}
.sign-in{
    float:right;
    height:22px;
    line-height:22px;
    color:#15AE67;
    text-align:center;
    background:#fff;
    margin-top:-11px;
    position:relative;
    top:50%;
    right:20px;
    border-radius:3px;
    padding:0 0.2rem;
}
.classification{
    height:1.867rem;
    background:#fff;
}
.classification img{
    width:0.6666667rem;
    margin-left: -0.333333334rem;
    position:relative;
    left:50%;
    top:0.4rem;
}
.classification p{
     text-align: center;
     margin-top:0.5rem;
     color:#000;
}
.news-box{
    /*height:2.3333334rem;*/
    margin-top:0.266666667rem;
    margin-bottom:0.266666667rem;
    background:#fff;
    padding:0.3rem 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;;
}
.news-box p{
    line-height:0.9rem;
    font-size:16px;
    padding:0 20px 0 40px;
    position:relative;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color:#000;
}
.news-box p:after{
    content:"";
    position:absolute;
    left:20px;
    margin-top:-3px;
    top:50%;
    width:6px;
    height:6px;
    background:#f00;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.classification{
    margin-bottom:0.266666667rem;
}

.greater-than-2{
    position: absolute;
    right:25px;
    bottom:5px;
    width:1rem;
    height:0.5rem;
    line-height:0.5rem;
    background-color:rgba(0,0,0,0.7);
    text-align: center;
    color:#fff;
    font-size:16px;
}


.loading-more{
    height:1.867rem;
    line-height:1.867rem;
    background:#EFEFF4;
    text-align:center;
    font-size:16px;
    color: #b2b2b2;

}
.loading-more-position.loading-more{
    width:100%;
    background:#EFEFF4;
    padding-top: 60%;
    padding-bottom: 100%;
}
.loading-more-position.loading-more img{
    height:1.1rem;
}
.loading-more img{
    height:0.8rem;
    vertical-align: middle;
    margin-right:10px;
    animation: App-logo-spin infinite 1.5s linear;
}
@keyframes App-logo-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
.writing-comment{
    position:fixed;
    bottom:40px;
    right:30px;
    z-index: 99;
    width:1.8rem;
}
.writing-comment img{
    width:100%;
}
.images-box-home{
    width: 100%;
    position: relative;
    display: block;
    background-size: cover;
    background-position: 50% 50%;
}
.talent-box{
    text-align: center;
    line-height:1rem;
    color:#15AE67;
    background:#fff;
}
.current-select{
    position:relative;
}
.current-select:after{
    content:"";
    position:absolute;
    margin-left:-0.2rem;
    left:50%;
    bottom:-1px;
    border:0.2rem solid #528E00;
    border-top-color:transparent;
    border-left-color:transparent;
    border-right-color:transparent;
}
.background-box{
    background:url("../../images/background.png") no-repeat;
    background-size:100%;
    padding:1rem 0 0 0;
}
.talent-img-header{
    width:2.5rem;
    height:2.5rem;
    margin:0 auto;
    border-radius:50%;
    background:#C0D45B;
    padding:0.2rem;
    box-sizing: border-box;
}
.talent-img-header .inner-round{
    width:100%;
    height:100%;
    background:#DFE9A8;
    padding:0.2rem;
    border-radius:50%;
    box-sizing: border-box;
    position: relative;
}
.talent-img-header .inner-round .header{
    width:100%;
    height:100%;
    border-radius:50%;
}
.crown-box{
    position: absolute;
    top: -0.8rem;
    left: 0px;
}
.crown-box img{
    width:2rem;
}
.top-name{
    text-align:center;
    color:#70a400;
    font-size:14px;
    margin-top:0.5rem;
}
.ranking-list>p{
    text-align: center;
    color:#9e9e9e;
    font-size: 14px;
    padding:0.5rem 0;
}
.ranking-list{
    background:#D3E577;
    margin-top:0.5rem;
    padding-bottom:0.2rem;
}
.list-ranking img{
    width:1.1rem;
    height:1.1rem;
    vertical-align: middle;
    border-radius: 50%;
}
.list-ranking {
    line-height:1.1rem;
    padding:0.3rem 0;
}
.list-ranking-box{
    background:#fff;
    margin:0 0.3rem 0.3rem;
    border-radius:5px;
}
.list-ranking .box-1,
.list-ranking .box-3{
    text-align: center;
}
.list-ranking .box-1{
    color:#fff;
    font-size:14px;
}
.list-ranking .box-2,
.list-ranking .box-3{
    font-size:14px;
    color:#000;
}
.list-ranking .box-2{
    margin:0 0 0 0.5rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.list-ranking .box-2 img{
    margin:0  0.5rem 0 0;
}
.list-ranking .first{
    display:block;
    color:#ff890e;
    background:#ffdd55;
    height:0.7rem;
    width:0.7rem;
    line-height:0.7rem;
    margin:0 auto;
    margin-top:0.2rem;
    border-radius: 50%;
}
.list-ranking .other{
    display:block;
    color:#fff;
    background:#D3E577;
    height:0.7rem;
    width:0.7rem;
    line-height:0.7rem;
    margin:0 auto;
    margin-top:0.2rem;
    border-radius: 50%;
}
.nothing-count{
    padding:0 0.3rem 0;
    margin-top:50%;
    font-size:18px;
    text-align: center;
}
